
<div class="f-nav-detail">
    <detail-nav></detail-nav>
</div>
<div class="pay-main">
    <form id="payForm" class="alipayform" method="POST" target="_blank">
        <div class="pay-center">
            <h1>订单支付</h1>
            <p>请在24小时之内完成支付，超出24小时订单将会被取消，需重新下单购买</p>
            <p>实付金额:<b>￥{{price}}</b><span ng-click="payDetail()">订单详情<img src="them/imag/threeIcon.png"></span></p>
            <div ng-repeat="item in dataList" ng-if="detail">
                <div>
                    <div class="pay-detail" ng-repeat="items in item.cartList" ng-if="items.scId">
                        <span>课程名称：{{items.course.title}}</span>
                        <span>课程有效期：永久有效</span>
                        <span>应付金额：￥{{items.money}}</span>
                    </div>
                </div>
            </div>
            <div ng-if="detail">
                <div>
                    <div class="pay-detail">
                        <span>课程名称：{{courseInfo.title}}</span>
                        <span>课程有效期：永久有效</span>
                        <span>应付金额：￥{{courseInfo.price}}</span>
                    </div>
                </div>
            </div>
            <p>支付方式：</p>
            <p>
                <span class="ali-pay" ng-click="aliPay()" ng-class="{'ali':ali}"></span>
                <!--<span class="chat-pay" ng-click="chatPay()" ng-class="{'weChat':weChat}"></span>-->
            </p>
            <input type="hidden" name="WIDout_trade_no" id="out_trade_no" ng-value="orderInfo.data">
            <input type="hidden" name="WIDsubject" ng-value="dataList[0].fullName||courseInfo.title">
            <input type="hidden" name="WIDtotal_fee" ng-value="price">
            <input type="hidden" name="WIDbody" value="即时到账测试">
            <input class="pay-now" type="button" value="立即支付" ng-click="pay()">
        </div>
    </form>
</div>
<div ng-include="'app/business/common/footer.html'"></div>
<style>
    .pay-main{
        padding:20px 0 50px 0;
        width: 100%;
        height:439px;
        background: url(them/img/jb-bg.png) 0 0 repeat;
    }
    .pay-center{
        width:1168px;
        padding:30px;
        border: 1px solid #dddddd;
        margin:0 auto;
        background: #fff;
    }
    .pay-center h1{
        font-size: 20px;
        margin-bottom: 42px;
    }
    .pay-center p,.pay-detail{
        padding-left: 18px;
    }
    .pay-now{
        margin-left: 18px;
        border:0;
    }
    .pay-center p:nth-of-type(1){
        font-size: 16px;
        color: #666;
        margin-bottom: 30px;
    }
    .pay-center p:nth-of-type(2){
        font-size: 12px;
        color: #666;
        margin-bottom: 15px;
    }
    .pay-center p:nth-of-type(2) b{
        font-size: 16px;
        color: #f00;
        margin-right: 24px;
    }
    .pay-center p:nth-of-type(2) span{
        cursor: pointer;
    }
    .pay-center p:nth-of-type(3){
        margin-top: 20px;
        font-size: 12px;
        color: #666;
    }
    .pay-center p:nth-of-type(4){
        overflow: hidden;
        margin:25px 0 40px 0;
    }
    .pay-center p:nth-of-type(4) span{
        float: left;
        width:154px;
        height:40px;
        margin-right: 20px;
        cursor: pointer;
    }
    .ali-pay{
        background: url("them/imag/alipay1.png") no-repeat center center;
    }
    .pay-center .ali{
        background: url("them/imag/alipay2.png") no-repeat center center;
    }
    .chat-pay{
        background: url("them/imag/chatpay1.png") no-repeat center center;
    }
    .pay-center .weChat{
        background: url("them/imag/chatpay2.png") no-repeat center center;
    }
    .pay-now{
        width:220px;
        height:50px;
        line-height: 50px;
        text-align: center;
        color: #fff;
        font-size: 24px;
        border-radius: 5px;
        background: #30a3ff;
        margin-bottom: 18px;
        cursor: pointer;
    }

    .pay-detail{
        width:1080px;
        height:50px;
        line-height: 50px;
        color: #666;
        font-size: 12px;
        background: #f8f8f8;
        margin-left: 18px;
    }
    .pay-detail span{
        margin-right: 80px;
    }
</style>